export const commonModalMixin = {
  data () {
    return {
      modalWidth: 800, //模态框宽度   固有属性
      drawerWidth: 700, //抽屉宽度  固有属性
      modaltoggleFlag: true, //是否最大化窗口  固有属性
      disableSubmit: false, //放弃编辑  固有属性
      validatorRules: { //验证规则  固有属性
        name: {
          rules: [{
            required: true, message: '请输入配置名称!'
          }]
        },
        sourceId: { rules: [{ required: true, message: '请选择对象id!' }] }
      },
      title: "操作", //操作标题，固有属性
      visible: false, //可见性，固有属性
      model: {}, //操作模型，固有属性
      labelCol: { //标签适配,固有属性
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: { //标签元素适配，固有属性
        xs: { span: 24 },
        sm: { span: 16 }
      },
      confirmLoading: false, //提交加载状态，固有属性
      form: this.$form.createForm(this), //动态生成表单，固有属性
      url: { //资源链接，固有属性
        fileUpload: window._CONFIG['domianURL'] + "/sys/common/upload", //上传文件链接，固有属性,
        add: '', //固有属性
        edit: '' //固有属性
      }
    }
  },
  computed: {
    uploadAction: function () { //上传文件的地址计算，固有属性
      return this.url.fileUpload;
    }
  },
  methods: {
    //窗口最大化切换
    toggleScreen() { //切换窗口，固有属性
      if (this.modaltoggleFlag) {
        this.modalWidth = window.innerWidth;
      } else {
        this.modalWidth = 800;
      }
      this.modaltoggleFlag = !this.modaltoggleFlag;
    },

    refresh () {
      this.model = {}
      this.form.resetFields();
    },
    add () {
      this.refresh();
      this.visible = true
    },
    edit (record) { //编辑，固有方法
      this.refresh()
      this.resetScreenSize(); // 调用此方法,根据屏幕宽度自适应调整抽屉的宽度
      let that = this;
      that.visible = true;
      if (record.hasOwnProperty("id")) {
      }
      that.model = Object.assign({}, record);
      that.$nextTick(() => {
        that.form.setFieldsValue(this.model)
      });
    },
    close () { //关闭模态框，固有方法
      this.$emit('close');
      this.visible = false;
      this.disableSubmit = false;
    },
    handleSubmit () { //提交资源，固有方法
      const that = this;
      // 触发表单验证
      this.form.validateFields((err, values) => {
        if (!err) {
          that.confirmLoading = true;
          let formData = Object.assign(this.model, values);
          let obj;
          if (!this.model.id) {
            //修改
            obj = that.api.add(formData, that);
          } else {
            //新增
            obj = that.api.edit(formData, that);
          }
          obj.then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.$emit('ok');
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            that.confirmLoading = false;
            that.close();
          })
        }
      })
    },
    handleCancel () { //固有方法
      this.close()
    },
    // 根据屏幕变化,设置抽屉尺寸
    resetScreenSize() { //固定方法
      let screenWidth = document.body.clientWidth;
      if (screenWidth < 500) {
        this.drawerWidth = screenWidth;
      } else {
        this.drawerWidth = 700;
      }
    }
  }
}
